<!DOCTYPE html>
<html>

<head>
	<meta name="msvalidate.01" content="6E060A6C5F4B89D5C72FEA2C2697AA02" />
	<meta http-equiv="X-UA-Compatible" content="IE=edge">
	<meta name="viewport" content="width=device-width, initial-scale=1" />
	<meta charset="utf-8">
	<title>轻阅读</title>
	<meta name="keywords" content="小说,阅读,免费" />
	<meta name="description" content="轻阅读是一款 Android 上的开源文本图书阅读软件，没有广告，专心于阅读的小软件。" />
	<meta >
	<style>
		html {
			padding: 0;
			margin: 0;
		}

		body {
			padding: 20px;
			margin: 0;
			background-color: black;
			color: #ddd;
			font-size: 18px;
		}

		div.screenshots img {
			width: 150px;
			margin: 15px;
			border: 1px solid #555;
			cursor: pointer;
		}

		a {
			text-decoration: none;
			color: #fe7;
		}

		a:hover,
		a:active {
			color: red;
		}

		a.download-link {
			display: block;
			padding: 20px;
			background-color: #555;
			color: #ddd;
			user-select: none;
		}

		a.download-link:hover {
			background-color: #777;
			color: #ddd;
		}

		a.download-link:active {
			color: #F73;
		}
		#preview {
			display: flex;
			justify-content: center;
			align-items: center;
			position: fixed;
			left: 0;
			top: 0;
			right: 0;
			bottom: 0;
		}
		#preview::before{
			content: ' ';
			display: block;
			position: absolute;
			left: 0;
			top: 0;
			right: 0;
			bottom: 0;
			background-color: #ccc;
			opacity: 50%;
			z-index: 1;
		}
		#preview>img {
			max-width: 80%;
			max-height: 95%;
			z-index: 2;
			box-shadow: 5px 5px 5px #333;
		}
		#preview>img::after {
			content: ' ';
			display: block;
			position: relative;
			right: 10px;
			top:-20px;
			width: 50px;
			height: 50px;
			background-color: white;
		}

		@media(max-width:720px) {
			div.screenshots img {
				width: 35%;
				margin: 15px;
				border: 1px solid #555;
			}
		}
	</style>

</head>

<body>
	<h1>轻阅读</h1>
	<p style="color:#888">轻阅读是一款 Android 上的开源文本图书阅读软件，没有广告，专心于阅读的小软件。</p>
	<ul style="color:#888">
		<li>开源，免费，无任何形式的广告</li>
		<li>支持本地图书阅读，WIFI 上传，图书交流。</li>
		<li>支持 TXT 和 EPUB 格式的文本阅读</li>
		<li>启动和打开图书速度快，自动打开上次的阅读位置，随开随读，无后台服务</li>
		<li>自动生成章节目录速度快、准确，支持自定义章节目录生成规则</li>
		<li>深色护眼界面，亮度由手机系统控制，支持阳光模式，白天、晚上看书眼睛都舒服</li>
		<li>支持文本到语音阅读图书（TTS）</li>
		<li>支持音量键（包括线控耳机）和蓝牙键盘翻页，支持耳机控制语音播放。</li>
		<li>支持汉语词典和英汉词典，长按文字，可速查生辟字词</li>
	</ul>
	<p style="color:#888">图书交流需要注册账号，<a href="mailto:thor.qin@qq.com?subject=%E7%94%B3%E8%AF%B7%E9%82%80%E8%AF%B7%E7%A0%81">可通过发邮件申请邀请码</a>，也可从其他会员处获取邀请码。</p>
	<a id="download" href="#" class="download-link">
		<image src="images/download.png" width="24" height="height"
			style="width:24px;height:24px;vertical-align: middle;margin-right: 10px">
			<span style="vertical-align: middle">下载 Android 安装包</span>
	</a>
	<div style="margin-top:30px">
		<b>当前版本：</b><br>
		<div id="version" style="padding:10px;color:#888"></div>
	</div>
	<div>
		<b>最后更新：</b><br>
		<div id="description" style="padding:10px;color:#888"></div>
	</div>

	<hr>
	<h1>屏幕截图</h1>
	<div class="screenshots" onclick="openShow(event)">
		<img src="images/screenshots/thumbnails/1.jpg">
		<img src="images/screenshots/thumbnails/2.jpg">
		<img src="images/screenshots/thumbnails/3.jpg">
		<img src="images/screenshots/thumbnails/4.jpg">
		<img src="images/screenshots/thumbnails/5.jpg">
		<img src="images/screenshots/thumbnails/6.jpg">
		<img src="images/screenshots/thumbnails/7.jpg">
		<img src="images/screenshots/thumbnails/8.jpg">
		<img src="images/screenshots/thumbnails/9.jpg">
		<img src="images/screenshots/thumbnails/10.jpg">
	</div>
	<div id="preview" style="display: none;" onclick="closeShow()">
		<img src="">
	</div>
	<address style="border-top:1px solid #333;padding-top:5px">
		作者：秦诺<br>
		邮箱：<a href="mailto:thor.qin@qq.com">thor.qin@qq.com</a>
	</address>
	<script>
		function format(txt) {
			return txt.replace(/[\n<>&]/gm, function (src) {
				if (src === '\n') {
					return "<br>";
				} else if (src === "<") {
					return "&lt;";
				} else if (src === ">") {
					return "&gt;"
				} else if (src === "&") {
					return "&amp;"
				} else {
					return src;
				}
			})
		}
		var download = document.getElementById("download");
		var version = document.getElementById("version");
		var description = document.getElementById("description");
		fetch("version.json").then((result) => {
			result.json().then((obj) => {
				download.href = obj.download;
				version.innerHTML = obj.version;
				description.innerHTML = format(obj.description);
			})
		})
		function openShow(e) {
			let preview = document.getElementById('preview');
			let elem = e.target || e.srcElement;
			if (elem && /^img$/i.test(elem.nodeName)) {
				preview.querySelector('img').src = elem.src.replace('thumbnails', '');
				preview.style.display = 'flex';
			}
		}

		function closeShow() {
			let preview = document.getElementById('preview');
			preview.querySelector('img').src = null;
			preview.style.display='none';
		}
	</script>
</body>

</html>
